{
  // 猫头鹰控件处理
  const pwd = document.querySelector("#login [name=password]");
  pwd.addEventListener("focus", function () {
    this.parentNode.parentNode.previousElementSibling.classList.add("password");
  });

  pwd.addEventListener("blur", function () {
    this.parentNode.parentNode.previousElementSibling.classList.remove(
      "password"
    );
  });

  const pwd1 = document.querySelector("#register [name=password]");
  pwd1.addEventListener("focus", function () {
    this.parentNode.parentNode.previousElementSibling.classList.add("password");
  });

  pwd1.addEventListener("blur", function () {
    this.parentNode.parentNode.previousElementSibling.classList.remove(
      "password"
    );
  });
}

{
  // 切换注册
  const reg = document.querySelector("#login .register");
  reg.addEventListener("click", () => {
    document.querySelector("#login").style.display = "none";
    document.querySelector("#register").style.display = "block";
  });
  // 返回登录
  const login = document.querySelector("#register .register");
  login.addEventListener("click", () => {
    document.querySelector("#login").style.display = "block";
    document.querySelector("#register").style.display = "none";
  });
}
const username = document.querySelector('[name="username"]')
username.addEventListener('change', userName)
function userName() {
  let reg = /^[\u4e00-\u9fa5]{3,10}$/
  if (!reg.test(username.value)) {
    document
      .querySelector('.username span:nth-child(3)')
      .classList.remove('icon-duihao')
    document
      .querySelector('.username span:nth-child(3)')
      .classList.add('icon-chahao')
  } else {
    document
      .querySelector('.username span:nth-child(3)')
      .classList.remove('icon-chahao')
    document
      .querySelector('.username span:nth-child(3)')
      .classList.add('icon-duihao')
  }
}
const password = document.querySelector('[name="password"]')
password.addEventListener('change', passWord)
function passWord() {
  let reg = /^[a-zA-Z+-_]{3,10}$/
  if (!reg.test(password.value)) {
    document
      .querySelector('.pwd span:nth-child(3)')
      .classList.remove('icon-duihao')
    document
      .querySelector('.pwd span:nth-child(3)')
      .classList.add('icon-chahao')
  } else {
    document
      .querySelector('.pwd span:nth-child(3)')
      .classList.remove('icon-chahao')
    document
      .querySelector('.pwd span:nth-child(3)')
      .classList.add('icon-duihao')
  }
}
const login = document.querySelector('.login')
// console.log(login);
login.addEventListener('click', function (e) {
  if (!userName() && !passWord()) {
    localStorage.setItem('user', username.value)
    location.href = './index.html'
  }
})

 

